<template>
  <div class="taskView">
    <div p-5>
      <a-tabs v-model:activeKey="activeKey">
        <a-tab-pane key="1" tab="任务详情">
          <TaskInfo :id="route.query.id" :tittle="false"></TaskInfo>
          <div class="taskInfo-body-box" v-if="taskData?.taskStatus >= 5">
            <div class="taskInfo-body-box-tittle">
              <div class="taskInfo-body-box-tittle-left"></div>
              <div class="taskInfo-body-box-tittle-right">处置信息</div>
            </div>
            <div class="taskInfo-body-box-info">
              <a-row :gutter="24">
                <a-col class="gutter-row" :span="8">
                  <BookCreate
                    :type="3"
                    :id="id"
                    :url="taskData?.safeOpinionFileUrl"
                    @getBookUrl="getBookUrl"
                    :isShow="caseShow(taskData?.taskStatus)"
                  />
                </a-col>
              </a-row> </div
          ></div>
          <div class="taskInfo-body-box" v-if="taskData?.taskStatus == 6">
            <div class="taskInfo-body-box-tittle">
              <div class="taskInfo-body-box-tittle-left"></div>
              <div class="taskInfo-body-box-tittle-right">送达回证</div>
            </div>
            <div class="taskInfo-body-box-info">
              <a-row :gutter="24">
                <a-col class="gutter-row" :span="8">
                  <BookCreate
                    :type="16"
                    :id="route.query.id"
                    :url="sdhzfileInfoData.oldFileUrl"
                    :newFileUrl="sdhzfileInfoData.newFileUrl"
                    :caseFileId="sdhzfileInfoData.id"
                    :isLicense="true"
                    @getBookUrl="getBookUrl"
                  />
                </a-col>
              </a-row> </div
          ></div>
        </a-tab-pane>
        <a-tab-pane key="2" tab="任务审批记录">
          <DynamicTable
            :data-request="approveTableData"
            :columns="approveCoumns"
            :scroll="{ x: 1600 }"
            :search="false"
            :pagination="false"
            :showToolBar="false"
            bordered
          >
          </DynamicTable>
        </a-tab-pane>
      </a-tabs>
    </div>

    <a-modal title="记录表编号设置" v-model:open="open" :width="400" @ok="handleOk">
      <BeCurrent ref="administrativePenalty" @getDataUrl="getDataUrl" />
    </a-modal>
    <div class="bottomBox"></div>
    <div class="bottomBtns" style="z-index: 3">
      <a-space :size="12">
        <a-button size="large" @click="cacel">取消</a-button>
        <!-- <a-button type="primary" @click="onSubmit(1)">暂存</a-button> -->
        <a-button size="large" type="primary" @click="onSubmit(0)">提交</a-button>
      </a-space>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { useRoute } from 'vue-router';
  import router from '@/router';
  import { ref, onMounted } from 'vue';
  import { getApproveRecord, processTask, taskInfo } from '@/api/administrative';
  import TaskInfo from '../dispose/components/taskInfo.vue';
  import { approveCoumns } from './columns';
  import { message } from 'ant-design-vue';
  import { useTabsViewStore } from '@/store/modules/tabsView';
  import { useTable } from '@/components/core/dynamic-table';
  const [DynamicTable, dynamicTableInstance] = useTable();
  const tabsViewStore = useTabsViewStore();
  const route = useRoute();

  const open = ref(false);
  const id = route.query.id as any;

  const activeKey = ref('1');

  const approveTableData = async (params): Promise<API.TableListResult> => {
    const data = await getApproveRecord(route.query.id);
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve({
          list: data,
          ...params,
        });
      }, 500);
    });
  };

  const cacel = () => {
    router.push({
      path: '/administrative/administrative/strative',
    });
  };

  const taskData = ref();

  const administrativePenalty = ref();
  const handleOk = () => {
    administrativePenalty.value.confirm();
  };

  const getBookUrl = (data) => {
    if (data.code == 0) {
      taskDetailApi();
    }
  };

  const caseShow = (val) => {
    switch (val) {
      case 3:
        return true;
      case 5:
        return true;
      case 6:
        return false;
      default:
        return false;
    }
  };

  const getDataUrl = async (data) => {
    console.log(data);
    let params = {
      id: id,
      taskStatus: 5,
      type: '0',
      ...data,
    };
    const res = await processTask(params);
    if (res.code == 0) {
      message.success('提交成功！');
      tabsViewStore.closeCurrentTabToUrl(route, '/administrative/administrative/strative');
      open.value = false;
    }
  };

  //送达回证
  const sdhzfileInfoData = ref({
    oldFileUrl: '123',
    newFileUrl: '',
    id: '',
  });

  const onSubmit = async (val) => {
    if (val == 1) {
      let data = {
        id: id,
        taskStatus: taskData.value?.taskStatus,
        type: '1',
      };
      const res = await processTask(data);

      if (res.code == 0) {
        message.success('已暂存');
        router.push({
          path: '/administrative/administrative/strative',
        });
      }
    } else if (taskData.value?.taskStatus == 5) {
      open.value = true;
    } else if (taskData.value?.taskStatus == 6) {
      let params = {
        id: id,
        taskStatus: 6,
        type: '0',
        fileUrl: taskData.value?.delivReceiptFileUrl,
      };
      const res = await processTask(params);
      if (res.code == 0) {
        message.success('提交成功！');
        tabsViewStore.closeCurrentTabToUrl(route, '/administrative/administrative/strative');
      }
    }
  };

  const taskDetailApi = async () => {
    const data = await taskInfo(route.query.id);
    taskData.value = data;
    console.log(taskData.value?.fileInfoList);

    if (taskData.value?.fileInfoList?.length != 0) {
      if (taskData.value.fileInfoList.filter((item) => item.fileType == 8).length) {
        sdhzfileInfoData.value = taskData.value.fileInfoList.filter(
          (item) => item.fileType == 8,
        )[0];
      } else {
        sdhzfileInfoData.value = {
          oldFileUrl: '123',
          newFileUrl: '',
          id: '',
        };
      }
    }
  };

  onMounted(async () => {
    if (route.query.id) {
      taskDetailApi();
    }
  });
</script>
<style lang="less" scoped>
  .taskView {
    background-color: rgb(255 255 255 / 100%);

    .taskInfo {
      &-body {
        &-box {
          margin-bottom: 16px;

          &-tittle {
            display: flex;
            align-items: center;
            padding: 13px 0;

            &-left {
              height: 14px;
              margin-right: 7px;
              border: 1px solid #0f53ac;
              border-radius: 4px;
            }

            &-right {
              color: rgb(68 68 68 / 100%);
              font-size: 16px;
              font-weight: 400;
              line-height: 24px;
            }
          }
        }
      }
    }
  }
</style>
